import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:flutter_vant_kit/widgets/button.dart';
import 'package:flutter_vant_kit/widgets/dialog.dart';
import 'package:provider/provider.dart';
import 'package:shoes_shop/api/api.dart';
import 'package:shoes_shop/core/utils.dart';
import 'package:shoes_shop/models/order_item_model.dart';
import 'package:shoes_shop/models/public_provider_model.dart';
import 'package:shoes_shop/pages/about/about.dart';
import 'package:shoes_shop/pages/mine/mine_provider.dart';
import 'package:shoes_shop/pages/order/order.dart';
import 'package:shoes_shop/pages/userInfo/updata_user_info_page.dart';

class MinePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // List<OrderItemModel> orderMenuList = orderMenulist;

    return Scaffold(
      body: SingleChildScrollView(
        child: Container(
          child: Stack(
            children: [
              Ink.image(
                height: 435.w,
                alignment: Alignment.topCenter,
                image: AssetImage('assets/mine_bg.png'),
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Container(
                    width: 670.w,
                    child: MultiProvider(
                      providers: [
                        ChangeNotifierProvider(create: (_) => MineProvider()),
                      ],
                      child: Consumer<MineProvider>(
                        builder: (context, provide, child) => Column(
                          children: [
                            SizedBox(
                              height: 120.w,
                            ),
                            // 头像 昵称 id
                            Stack(
                              children: [
                                Column(
                                  children: [
                                    SizedBox(
                                      height: 100.w,
                                    ),
                                    // 名称id
                                    InkWell(
                                      borderRadius: BorderRadius.circular(14.w),
                                      onTap: () {
                                        Navigator.push(
                                          context,
                                          MaterialPageRoute(
                                            builder: (context) =>
                                                UpdataUserInfoPage(),
                                          ),
                                        );
                                      },
                                      child: _frame(
                                          child: Column(
                                            children: [
                                              SizedBox(
                                                height: 140.w,
                                              ),
                                              Text(
                                                Provider.of<PublicProviderModel>(
                                                            context,
                                                            listen: true)
                                                        .userInfo['nickname'] ??
                                                    Provider.of<PublicProviderModel>(
                                                            context,
                                                            listen: true)
                                                        .userInfo['email'],
                                                style: TextStyle(
                                                    fontSize: 38.w,
                                                    color: Colors.black87),
                                              ),
                                              // SizedBox(
                                              //   height: 15.w,
                                              // ),
                                              // Text(
                                              //   'ID: 1234567890',
                                              //   style: TextStyle(
                                              //       fontSize: 30.w,
                                              //       color: Colors.black45),
                                              // ),
                                            ],
                                          ),
                                          height: 250.w),
                                    ),
                                  ],
                                ),
                                //头像
                                Center(
                                  child: InkWell(
                                    borderRadius: BorderRadius.circular(100.w),
                                    onTap: () {
                                      Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                          builder: (context) =>
                                              UpdataUserInfoPage(),
                                        ),
                                      );
                                    },
                                    child: Container(
                                      width: 200.w,
                                      height: 200.w,
                                      decoration: BoxDecoration(
                                        color: Colors.grey,
                                        // borderRadius: BorderRadius.circular(65.w),
                                        image: DecorationImage(
                                          image: Provider.of<PublicProviderModel>(
                                                          context,
                                                          listen: true)
                                                      .userInfo['avatarUrl'] ==
                                                  null
                                              ? AssetImage(
                                                  'assets/astronaut.png')
                                              : NetworkImage(Provider.of<
                                                          PublicProviderModel>(
                                                      context,
                                                      listen: true)
                                                  .userInfo['avatarUrl']),
                                        ),
                                        shape: BoxShape.circle,
                                      ),
                                    ),
                                  ),
                                ),
                              ],
                            ),
                            SizedBox(
                              height: 30.w,
                            ),
                            // 订单
                            _frame(
                              child: Padding(
                                padding: EdgeInsets.symmetric(vertical: 20.w),
                                child: Column(
                                  children: [
                                    Padding(
                                      padding: EdgeInsets.symmetric(
                                          horizontal: 20.w),
                                      child: Row(
                                        mainAxisAlignment:
                                            MainAxisAlignment.spaceBetween,
                                        children: [
                                          Text(
                                            '我的订单',
                                            style: TextStyle(
                                                color: Colors.black87,
                                                fontSize: 30.w,
                                                fontWeight: FontWeight.bold),
                                          ),
                                          InkWell(
                                            onTap: () {
                                              Navigator.push(
                                                context,
                                                MaterialPageRoute(
                                                  builder: (context) =>
                                                      OrderPage(index: 0),
                                                ),
                                              );
                                            },
                                            child: Row(
                                              children: [
                                                Text(
                                                  '查看订单',
                                                  style: TextStyle(
                                                      color: Colors.black45,
                                                      fontSize: 26.w),
                                                ),
                                                Icon(
                                                  Icons
                                                      .arrow_forward_ios_rounded,
                                                  size: 25.w,
                                                  color: Colors.black45,
                                                )
                                              ],
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                    SizedBox(
                                      height: 15.w,
                                    ),
                                    Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceEvenly,
                                      children: orderMenulist
                                          .asMap()
                                          .map(
                                            (index, item) {
                                              return MapEntry(
                                                index,
                                                InkWell(
                                                  onTap: () {
                                                    Navigator.push(
                                                      context,
                                                      MaterialPageRoute(
                                                        builder: (context) =>
                                                            OrderPage(
                                                                index: index),
                                                      ),
                                                    );
                                                  },
                                                  child: Column(
                                                    children: [
                                                      SvgPicture.asset(
                                                        '${item.icon}',
                                                        width: 70.w,
                                                        color: Colors.black54,
                                                      ),
                                                      SizedBox(
                                                        height: 5.w,
                                                      ),
                                                      Text(
                                                        '${item.title}',
                                                        style: TextStyle(
                                                            // fontWeight: FontWeight.bold,
                                                            color:
                                                                Colors.black87),
                                                      )
                                                    ],
                                                  ),
                                                ),
                                              );
                                            },
                                          )
                                          .values
                                          .toList(),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                            SizedBox(
                              height: 60.w,
                            ),
                            // 个人资料 关于
                            _frame(
                              child: Column(
                                children: [
                                  InkWell(
                                    borderRadius: BorderRadius.only(
                                      topLeft: Radius.circular(14.w),
                                      topRight: Radius.circular(14.w),
                                    ),
                                    child: Padding(
                                      padding: EdgeInsets.symmetric(
                                        horizontal: 30.w,
                                        vertical: 20.w,
                                      ),
                                      child: Row(
                                        mainAxisAlignment:
                                            MainAxisAlignment.spaceBetween,
                                        children: [
                                          Row(
                                            children: [
                                              SvgPicture.asset(
                                                'assets/user.svg',
                                                width: 40.w,
                                                color: Colors.black54,
                                              ),
                                              SizedBox(
                                                width: 30.w,
                                              ),
                                              Text('我的信息'),
                                            ],
                                          ),
                                          Icon(
                                            Icons.arrow_forward_ios_rounded,
                                            size: 25.w,
                                            color: Colors.black45,
                                          )
                                        ],
                                      ),
                                    ),
                                    onTap: () {
                                      Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                          builder: (context) =>
                                              UpdataUserInfoPage(),
                                        ),
                                      );
                                    },
                                  ),
                                  InkWell(
                                    onTap: () {
                                      Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                          builder: (context) => About(),
                                        ),
                                      );
                                    },
                                    child: Padding(
                                      padding: EdgeInsets.symmetric(
                                        horizontal: 30.w,
                                        vertical: 20.w,
                                      ),
                                      child: Row(
                                        mainAxisAlignment:
                                            MainAxisAlignment.spaceBetween,
                                        children: [
                                          Row(
                                            children: [
                                              SvgPicture.asset(
                                                'assets/warning.svg',
                                                width: 40.w,
                                                color: Colors.black54,
                                              ),
                                              SizedBox(
                                                width: 30.w,
                                              ),
                                              Text('关于'),
                                            ],
                                          ),
                                          Icon(
                                            Icons.arrow_forward_ios_rounded,
                                            size: 25.w,
                                            color: Colors.black45,
                                          )
                                        ],
                                      ),
                                    ),
                                  )
                                ],
                              ),
                            ),
                            SizedBox(
                              height: 30.w,
                            ),
                            _frame(
                              child: NButton(
                                width: double.infinity,
                                height: 80.w,
                                text: '退出登录',
                                size: 'large',
                                type: "primary",
                                borderRadius: BorderRadius.circular(14.w),
                                loading: provide.data['logouting'],
                                color: Colors.white,
                                textColor: Colors.red,
                                onClick: () {
                                  showDialog(
                                    context: context,
                                    builder: (_) {
                                      return NDialog(
                                        title: '提示',
                                        message: '确定退出登录？',
                                        showCancelButton: true,
                                        onConfirm: () async {
                                          provide.changeValue(
                                              'logouting', true);
                                          var res = await logout();
                                          if (res['code'] == 200) {
                                            showToast('退出成功');
                                            Provider.of<PublicProviderModel>(
                                                    context,
                                                    listen: false)
                                                .cleanUserInfo();
                                          } else {
                                            showToast('退出失败');
                                          }
                                          provide.changeValue(
                                              'logouting', false);
                                        },
                                      );
                                    },
                                  );
                                },
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                  )
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

//带阴影的白底圆角框
Widget _frame({Widget child, double height}) {
  return Ink(
    child: child,
    decoration: BoxDecoration(
      color: Colors.white,
      borderRadius: BorderRadius.circular(14.w),
      boxShadow: [
        BoxShadow(
            color: Color.fromRGBO(43, 102, 253, 0.1),
            offset: Offset(0.0, 14.w), //阴影xy轴偏移量
            blurRadius: 16.w, //阴影模糊程度
            spreadRadius: 0.0 //阴影扩散程度
            ),
      ],
    ),
    width: double.infinity,
    height: height,
  );
}
